/* eslint-disable */
import { createApp } from "vue";
import App from "./App.vue";
import Vant from "vant";
import "vant/lib/index.css";

import router from "@/router.js";

window.onload = function () {
  createExample();
};
function createExample() {
  const container = document.createElement("div");
  container.setAttribute("id", "example-content-app");
  container.setAttribute("draggable", "true");
  container.setAttribute(
    "style",
    "position: fixed;\n" +
      "    display: flex;\n" +
      "    bottom: 2%;\n" +
      "    width: 260px;\n" +
      "    padding: 10px 0;\n" +
      "    right: 2%;\n" +
      "    height: 240px;\n" +
      "    cursor: pointer;\n" +
      // "    align-items: center;\n" +
      // "    justify-content: center;\n" +
      "    background: white;\n" +
      "    border: 1px solid rgba(0, 0, 0, 0.05);\n" +
      "    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);\n" +
      "    border-radius: 12px;z-index:999"
  );
  document.body.appendChild(container);
  const url = window.location.href;
  console.log(url);
  const app = createApp(App, { url: url });
  app.use(Vant);
  app.use(router);
  app.mount("#example-content-app");

  var offsetX, offsetY;

  // container.addEventListener("dragstart", function (event) {
  //   offsetX = event.clientX - container.getBoundingClientRect().left;
  //   offsetY = event.clientY - container.getBoundingClientRect().top;
  //   event.dataTransfer.setData("text/plain", "Drag me!");
  // });

  // container.addEventListener("dragend", function (event) {
  //   console.log("offsetY:" + offsetY + ",offsetY:" + offsetY);
  //   // console.log("newX:" + newX + ",newY:" + newY);
  //   // 计算新位置
  //   var newX = event.clientX - offsetX;
  //   var newY = event.clientY - offsetY;
  //   container.style.left = parseInt(newX) + "px";
  //   container.style.top = parseInt(newY) + "px";
  // });
}
// chrome.runtime.onMessage.addListener(function (request) {
//   if (request.target === "CONTENT" && request.from === "BACKGROUND") {
//   }
// });
